<template>
  <div class="fixed w-full h-[84px] z-10">
    <div class="w-full h-full flex justify-between items-center">
      <v-btn @click="$emit('prve')" icon aria-label="返回上一级" variant="text">
        <BackIcon size="20"></BackIcon>
      </v-btn>
      <slot> </slot>
      <v-btn variant="text" @click="toShareLyric" icon>
        <j-icon size="24">mdi-share-variant</j-icon>
      </v-btn>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { useAudio } from "@/hooks/useAudio";
import BackIcon from "@/icon/home/后退.vue";
const { musicName } = useAudio();

function toShareLyric() {
  navigator.share({
    title: musicName.value,
    url: window.location.href,
  });
}
</script>
